<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<jsp:include page="../../../../commons.jsp"></jsp:include>
<html>
<head>
    <title>TOP100网页访问</title>
   <!-- BEGIN GLOBAL MANDATORY STYLES --> 
  <link href="${ctx}/resources/metronic/global/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" /> 
  <link href="${ctx}/resources/metronic/global/plugins/simple-line-icons/simple-line-icons.min.css" rel="stylesheet" type="text/css" /> 
  <!--<link href="${ctx}/resources/metronic/global/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>--> 
  <link href="${ctx}/resources/assets/plugins/cBootstrap3/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> 
  <link href="${ctx}/resources/metronic/global/plugins/bootstrap-switch/css/bootstrap-switch.min.css" rel="stylesheet" type="text/css" /> 
  <!-- END GLOBAL MANDATORY STYLES --> 
  <!-- BEGIN PAGE LEVEL PLUGINS --> 
  <link href="${ctx}/resources/metronic/global/plugins/bootstrap-select/css/bootstrap-select.min.css" rel="stylesheet" type="text/css" /> 
  <link href="${ctx}/resources/metronic/global/plugins/ladda/ladda-themeless.min.css" rel="stylesheet" type="text/css" /> 
  <link href="${ctx}/resources/metronic/global/plugins/jquery-multi-select/css/multi-select.css" rel="stylesheet" type="text/css" /> 
  <link href="${ctx}/resources/metronic/global/plugins/select2/css/select2.min.css" rel="stylesheet" type="text/css" /> 
  <link href="${ctx}/resources/metronic/global/plugins/select2/css/select2-bootstrap.min.css" rel="stylesheet" type="text/css" /> 
  <link href="${ctx}/resources/metronic/global/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet" type="text/css" /> 
  <link href="${ctx}/resources/metronic/global/plugins/bootstrap-editable/bootstrap-editable/css/bootstrap-editable.css" rel="stylesheet" type="text/css" /> 
  <link href="${ctx}/resources/metronic/global/plugins/bootstrap-toastr/toastr.min.css" rel="stylesheet" type="text/css" /> 
  <!--<link rel="stylesheet" href="${ctx}/resources/metronic/global/plugins/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css"/>--> 
  <!-- END PAGE LEVEL PLUGINS --> 
  <!-- BEGIN THEME GLOBAL STYLES --> 
  <link href="${ctx}/resources/metronic/global/css/components-rounded.min.css" rel="stylesheet" id="style_components" type="text/css" /> 
  <link href="${ctx}/resources/metronic/global/css/plugins.min.css" rel="stylesheet" type="text/css" /> 
  <!-- END THEME GLOBAL STYLES --> 
  <!-- BEGIN THEME LAYOUT STYLES --> 
  <link href="${ctx}/resources/metronic/layouts/layout3/css/layout.min.css" rel="stylesheet" type="text/css" /> 
  <link href="${ctx}/resources/metronic/layouts/layout3/css/themes/default.min.css" rel="stylesheet" type="text/css" id="style_color" /> 
  <link href="${ctx}/resources/metronic/layouts/layout3/css/custom.min.css" rel="stylesheet" type="text/css" /> 
  <!-- END THEME LAYOUT STYLES --> 
  <!-- BEGIN PAGE LEVEL PLUGINS --> 
  <script src="${ctx}/resources/metronic/global/plugins/jquery.min.js" type="text/javascript"></script> 
  <link rel="stylesheet" href="${ctx}/resources/assets/plugins/My97DatePicker/skin/WdatePicker.css" />
  <link href="${ctx}/resources/assets/plugins/bootstrap-multiselect/css/bootstrap-multiselect.css" rel="stylesheet" type="text/css" /> 
  <link href="${ctx}/resources/assets/plugins/zTreeV3/css/metroStyle/metroStyle.css" rel="stylesheet" type="text/css" /> 
  <link href="${ctx}/resources/assets/plugins/Validform/css/style.css" rel="stylesheet" type="text/css" /> 
  <!-- END PAGE LEVEL PLUGINS -->
  <link href="${ctx}/resources/assets/css/web.css?v=1.0.1" rel="stylesheet" />
  <!--BEGIN ICONFONT--> 
  <link rel="shortcut icon" href="favicon.ico" /> 
  <link rel="stylesheet" href="${ctx}/resources/assets/plugins/iconfont/iconfont.css" /> 
  <!--END ICONFONT-->
 <link href="${ctx}/resources/assets/plugins/sidebar/css/jquery-accordion-menu.css?v=1" rel="stylesheet" type="text/css" />
 <link href="${ctx}/resources/assets/plugins/sidebar/css/font-awesome.css" rel="stylesheet" type="text/css" />
 <!--<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">-->
 <style type="text/css">
  .sidebar-left-menu{width:180px;position:absolute;left:0;}
  .jquery-accordion-menu{
   width: 180px;
   min-width:180px;
   box-shadow:none;
  }
  .jquery-accordion-menu ul li a i{
   margin-top: 3px;
   width: 24px;
  }
  .jquery-accordion-menu .submenu-indicator{
   line-height: 15px;
  }
  .filterinput{
   background-color:rgba(249, 244, 244, 0);
   border-radius:15px;
   width:90%;
   height:30px;
   border:thin solid #FFF;
   text-indent:0.5em;
   font-weight:bold;
   color:#FFF;
  }
  #demo-list a{
   overflow:hidden;
   text-overflow:ellipsis;
   -o-text-overflow:ellipsis;
   white-space:nowrap;
   width:100%;
  }
  .fix-left-bg{
   position: fixed;
   left: 0;
   bottom:0;
   top: 41px;
   width: 180px;
   background: #343e43;
  }
 </style>
</head>
 <body class="page-container-bg-solid"> 
  <!-- BEGIN HEADER --> 
  <div class="page-header"> 
   <!-- BEGIN HEADER MENU --> 
   <div class="page-header-menu"> 
    <div class="container-fluid"> 
     <!-- BEGIN MEGA MENU --> 
     <!-- DOC: Apply "hor-menu-light" class after the "hor-menu" class below to have a horizontal menu with white background --> 
     <!-- DOC: Remove data-hover="dropdown" and data-close-others="true" attributes below to disable the dropdown opening on mouse hover --> 
     <div class="hor-menu"> 
      <div class="page-logo"> 
       <a href="index.html"> <img src="${ctx}/resources/assets/img/logo.png" alt="logo" class="logo-special" /> </a> 
      </div> 
      <ul class="nav navbar-nav"> 
       <li class=""> <a href="10086.html"> 集团考核 <span class="arrow"></span> </a> </li> 
       <li> <a href="group-web-index.html"> 省内分析 <span class="arrow"></span> </a> </li> 
       <li class=""> <a href="device-gis.html"> 设备监控 <span class="arrow"></span> </a> </li> 
       <li class=""> <a href="alarm-detail.html"> 告警监控 <span class="arrow"></span> </a> </li> 
       <li class=""> <a href="export.html"> 自定义导出 <span class="arrow"></span> </a> </li> 
      </ul> 
     </div>
     <!-- END MEGA MENU --> 
    </div> 
   </div> 
   <!-- END HEADER MENU --> 
  </div> 
  <!-- END QUICK SIDEBAR -->
  <div class="page-container"> 
   <div class="sidebar-left-menu">
    <div class="fix-left-bg"></div> 
    <div id="jquery-accordion-menu" class="jquery-accordion-menu black"> 
     <!--<div class="jquery-accordion-menu-header" id="form"></div>--> 
     <ul id="demo-list"> 
      <li> <a href="#"><i class="fa fa-cog"></i>资源管理处测试 </a> 
       <ul class="submenu"> 
        <li><a href="#">预排名估算</a></li> 
        <li><a href="#">PC客户端视频</a></li> 
        <li><a href="#">手机视频 </a></li> 
        <li><a href="#">IDC服务器PING测试 </a></li> 
        <li><a href="#">TOP5游戏PING测试 </a></li> 
        <li><a href="#">十大网银+十大证券测试 </a></li> 
        <li><a href="#">TOP100网站测试 </a></li> 
       </ul> </li> 
      <li class="active"> <a href="#" class="submenu-indicator-minus"><i class="fa fa-cog"></i>质量管理处测试 </a> 
       <ul class="submenu" style="display: block;"> 
        <li><a href="./group-web-rank.html">预排名估算 </a></li> 
        <li class="active"><a href="./group-web-index.html">TOP100网页访问</a></li> 
        <li><a href="#">客户端视频 </a></li> 
        <li><a href="#">游戏PING测试 </a></li> 
        <li><a href="#">HTTP文件下载 </a></li> 
        <li><a href="#">QOS Ping测试 </a></li> 
        <li><a href="#">BRAS Ping测试 </a></li> 
       </ul> </li> 
      <li> <a href="#"><i class="fa fa-cog"></i>互联互通处测试 </a> 
       <ul class="submenu"> 
        <li><a href="#">预排名估算</a></li> 
        <li><a href="#">集团骨干出口PING测试</a></li> 
        <li><a href="#">集团骨干出口WEB访问 </a></li> 
        <li><a href="#">集团三方出口PING测试 </a></li> 
        <li><a href="#">集团三方出口WEB访问 </a></li> 
       </ul> </li> 
     </ul> 
     <!--<div class="jquery-accordion-menu-footer">--> 
     <!--Footer--> 
     <!--</div>--> 
    </div> 
   </div> 


   <div class="has-left-menu"> 
    <ul class="page-breadcrumb breadcrumb"> 
     <li> <a href="index.html">省内分析</a> <small>/</small> </li> 
     <li> <a href="#">质量管理处测试</a> <small>/</small> </li> 
     <li> <span>Top100网页访问</span> </li> 
    </ul> 
    <div class="page-content"> 
     <div class="portlet light "> 
      <div class="portlet-title"> 
       <div class="caption"> 
        <span class="caption-subject font-dark uppercase "> Top100网页访问 </span> 
       </div> 
       <div class="actions"> 
        <form class="form-inline"> 
         <div class="form-group mb0"> 
          <label>网站选择：</label> 
          <select id="select-sceneReport" multiple="multiple"> <option selected="" value="cheese">网站1</option> <option selected="" value="tomatoes">网站2</option> <option selected="" value="mozarella">网站3</option> <option selected="" value="mushrooms">网站4</option> <option selected="" value="pepperoni">网站5</option> <option selected="" value="onions">网站6</option> <option selected="" value="onions6">网站7</option> <option selected="" value="onions8">网站8</option> <option selected="" value="onion9">网站9</option> </select> 
         </div> &nbsp; 
         <div class="form-group mb0"> 
          <label>时间：</label> 
          <div class="form-control creatSliderBox"> 
           <div id="creatSlider" style="width: 220px;display: inline-block"></div> 
          </div> 
         </div> &nbsp; 
         <div class="form-group mb0 customTime" style="display: none;"> 
          <label>开始时间 :</label> 
          <input type="text" style="width: 90px;" class="form-control read-only-normal" placeholder="开始时间" id="startTime1" name="startTime" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd',maxDate:'#F{$dp.$D(\'endTime1\');}',isShowClear:false,readOnly:true})" readonly="" /> &nbsp;
          <label>结束时间 :</label> 
          <input type="text" style="width: 90px;" class="form-control read-only-normal" placeholder="结束时间" id="endTime1" name="endTime" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'startTime1\');}',isShowClear:false,readOnly:true})" readonly="" /> 
         </div> &nbsp; 
         <div class="btn-group" data-toggle="buttons"> 
          <label class="btn btn-tabs "> <input type="checkbox" class="toggle" /> 闲时 </label> 
          <label class="btn btn-tabs active"> <input type="checkbox" class="toggle" /> 忙时 </label> 
         </div> 
        </form> 
        <script>
    $(function(){
        $("#select-sceneReport").multiselect({
            buttonWidth: '180px',
            enableFiltering: true,
            enableFullValueFiltering: true,
            includeSelectAllOption: true,
            maxHeight: 200
        });
        $(".btn-group label").click(function(){
            if($(this).siblings().hasClass("active")){
            }else{
                if($(this).hasClass("focus active")){
                    $(this).removeClass().addClass("btn btn-tabs focus btn-show-bg")
                }else{
                    $(this).removeClass().addClass("btn btn-tabs focus btn-show-bg")
                }
            }
        })

        $("#creatSlider").slider({
            cycle:["最近一天","最近三天","最近一周","自定义"],
            color:"deepskyblue",
            setTarget:1,
            chooseCount:function(element,index){
                if(index==3){
                    $(".customTime").show({
                        duration: 300,
                    })
                }else{
                    $(".customTime").hide({
                        duration: 300,
                    })
                }
            },
        })
    })
</script> 
       </div> 
      </div> 
      <div class="portlet-body"> 
       <div class="alert alert-info alert-mini text-center" role="alert"> 
        <div class="ins-tip">
         提示：当前指标90%页面展示时延属正常范围，测试良好，网站达标率正常，无任何异常
        </div> 
       </div> 
       <div class="ins-box"> 
        <div class="desc">
          关键指标 
         <button type="button" data-toggle="modal" data-target="#keyIndex" class="btn btn-success btn-xs"> <i class="fa fa-cog"></i></button> 
        </div> 
        <div class="ins-block"> 
         <div class="ins-widget"> 
          <div class="count">
           34.23
           <small>ms</small>
          </div> 
          <div class="text">
           90%页面展示时延
          </div> 
         </div> 
         <div class="ins-widget"> 
          <div class="count">
           100
           <small>%</small>
          </div> 
          <div class="text">
           网站达标率
          </div> 
         </div> 
         <!--<div class="ins-widget" id="ins-ping-widget" style="display: none;">
                                    <div class="count">32<small>ms</small></div>
                                    <div class="text">首页PING时延(ms)</div>
                                </div>--> 
        </div> 
       </div> 
       <div class="space-5"></div> 
       <div class="tabbable-line clickResize"> 
        <ul class="nav nav-tabs "> 
         <li class="active"> <a href="#tab_15_1" data-toggle="tab"> 总体分析 </a> </li> 
         <li style="display: none"> <a href="#tab_15_2" data-toggle="tab"> 对比分析 </a> </li> 
         <li> <a href="#tab_15_3" data-toggle="tab"> 闲忙分析 </a> </li> 
         <li> <a href="#tab_15_4" data-toggle="tab"> 异常元素</a> </li> 
         <li> <a href="#tab_15_5" data-toggle="tab"> 详单列表 </a> </li> 
        </ul> 
        <div class="tab-content border-top-0 pt10"> 
         <div class="tab-pane active" id="tab_15_1"> 
          <!--//CDN--> 
          <div class="section" style="display: none"> 
           <div class="section-title">
             CDN加速厂商 
           </div> 
           <div class="section-body "> 
            <div class="row"> 
             <div class="col-md-5 paddingLr"> 
              <table class="table halfTable text-center "> 
               <thead> 
                <tr> 
                 <th></th> 
                 <th>连接延时</th> 
                 <th>加载速率</th> 
                 <th>连接用时</th> 
                </tr> 
               </thead> 
               <tbody> 
                <tr> 
                 <td class="text-left"> <i class="iconfont icon-rect"></i>&nbsp; 网宿</td> 
                 <td>17.21 ms</td> 
                 <td>1817.18 kbps</td> 
                 <td>3.87 ms</td> 
                </tr> 
                <tr> 
                 <td class="text-left"> <i class="iconfont icon-rect "></i>&nbsp; 蓝汛</td> 
                 <td>17.21 ms</td> 
                 <td>1817.18 kbps</td> 
                 <td>3.87 ms</td> 
                </tr> 
                <tr> 
                 <td class="text-left"> <i class="iconfont icon-rect "></i>&nbsp; 帝联</td> 
                 <td>17.21 ms</td> 
                 <td>1817.18 kbps</td> 
                 <td>3.87 ms</td> 
                </tr> 
                <tr> 
                 <td class="text-left"> <i class="iconfont icon-rect "></i>&nbsp; 百度云</td> 
                 <td>17.21 ms</td> 
                 <td>1817.18 kbps</td> 
                 <td>3.87 ms</td> 
                </tr> 
                <tr> 
                 <td class="text-left"> <i class="iconfont icon-rect "></i>&nbsp; 阿里云</td> 
                 <td>17.21 ms</td> 
                 <td>1817.18 kbps</td> 
                 <td>3.87 ms</td> 
                </tr> 
                <tr> 
                 <td class="text-left"> <i class="iconfont icon-rect "></i>&nbsp; ICP自营</td> 
                 <td>17.21 ms</td> 
                 <td>1817.18 kbps</td> 
                 <td>3.87 ms</td> 
                </tr> 
               </tbody> 
              </table> 
             </div> 
             <div class="col-md-7 padding-20"> 
              <div id="cdnChart" style="width: 100%;height: 300px;"></div> 
             </div> 
            </div> 
           </div> 
          </div> 
          <!--// 元素运营商--> 
          <div class="section"> 
           <div class="section-title">
             元素运营商 
            <div class="pull-right">
             <button class="btn btn-default">指标配置</button>
            </div> 
           </div> 
           <div class="section-body "> 
            <div class="row"> 
             <div class="col-md-5 paddingLr"> 
              <table class="table halfTable text-center "> 
               <thead> 
                <tr> 
                 <th></th> 
                 <th>连接延时</th> 
                 <th>加载速率</th> 
                 <th>连接用时</th> 
                </tr> 
               </thead> 
               <tbody> 
                <tr> 
                 <td class="text-left"> <i class="iconfont icon-rect "></i>&nbsp;中国移动</td> 
                 <td>17.21 ms</td> 
                 <td>1817.18 kbps</td> 
                 <td>3.87 ms</td> 
                </tr> 
                <tr> 
                 <td class="text-left"> <i class="iconfont icon-rect "></i>&nbsp; 中国联通</td> 
                 <td>17.21 ms</td> 
                 <td>1817.18 kbps</td> 
                 <td>3.87 ms</td> 
                </tr> 
                <tr> 
                 <td class="text-left"> <i class=" iconfont icon-rect"></i>&nbsp; 中国电信</td> 
                 <td>17.21 ms</td> 
                 <td>1817.18 kbps</td> 
                 <td>3.87 ms</td> 
                </tr> 
                <tr> 
                 <td class="text-left"> <i class="iconfont icon-rect "></i>&nbsp; 其他</td> 
                 <td>17.21 ms</td> 
                 <td>1817.18 kbps</td> 
                 <td>3.87 ms</td> 
                </tr> 
               </tbody> 
              </table> 
             </div> 
             <div class="col-md-7 padding-20"> 
              <div id="operatorChart" style="width: 100%;height: 300px;"></div> 
             </div> 
            </div> 
           </div> 
          </div> 
          <!--// 资源调度--> 
          <div class="section"> 
           <div class="section-title">
             资源调度 
           </div> 
           <div class="section-body "> 
            <div class="row"> 
             <div class="col-md-6"> 
              <div class="text-right exportBtn"> 
               <button class=" col-md-offset-9 col-md-3 btn btn-default">导出外网元素</button> 
              </div> 
              <div id="resource1Chart" style="width: 100%;height: 300px;"></div> 
             </div> 
             <div class="col-md-6 "> 
              <div class="text-right exportBtn"> 
               <button class=" col-md-offset-9 col-md-3 btn btn-default">导出省外元素</button> 
              </div> 
              <div id="resource2Chart" style="width: 100%;height: 300px;"></div> 
             </div> 
            </div> 
           </div> 
          </div> 
          <!--//网络出口--> 
          <div class="section"> 
           <div class="section-title">
             网络出口 
            <div class="pull-right">
             <button class="btn btn-default">指标配置</button>
            </div> 
           </div> 
           <div class="section-body "> 
            <div class="row"> 
             <div class="col-md-5 paddingLr"> 
              <table class="table halfTable text-center "> 
               <thead> 
                <tr> 
                 <th></th> 
                 <th>连接延时</th> 
                 <th>加载速率</th> 
                 <th>连接用时</th> 
                </tr> 
               </thead> 
               <tbody> 
                <tr> 
                 <td class="text-left"> <i class="iconfont icon-rect "></i>&nbsp;联通出口</td> 
                 <td>17.21 ms</td> 
                 <td>1817.18 kbps</td> 
                 <td>3.87 ms</td> 
                </tr> 
                <tr> 
                 <td class="text-left"> <i class="iconfont icon-rect "></i>&nbsp; 电信出口</td> 
                 <td>17.21 ms</td> 
                 <td>1817.18 kbps</td> 
                 <td>3.87 ms</td> 
                </tr> 
                <tr> 
                 <td class="text-left"> <i class=" iconfont icon-rect"></i>&nbsp; 三方出口</td> 
                 <td>17.21 ms</td> 
                 <td>1817.18 kbps</td> 
                 <td>3.87 ms</td> 
                </tr> 
               </tbody> 
              </table> 
             </div> 
             <div class="col-md-7 padding-20 "> 
              <div id="netChart" style="width: 100%;height: 300px;"></div> 
             </div> 
            </div> 
           </div> 
          </div> 
          <!--top20--> 
          <div class="section"> 
           <div class="section-title">
             加载元素用时TOP20域名 
           </div> 
           <div class="section-body"> 
            <table class="table table-bordered table-advance text-center"> 
             <thead> 
              <tr> 
               <th class="text-center">排名</th> 
               <th class="text-left">域名</th> 
               <th class="text-center">命中IP</th> 
               <th class="text-center">用时</th> 
               <th class="text-left">速率</th> 
               <th class="text-center">元素总大小</th> 
               <th class="text-center">操作</th> 
              </tr> 
             </thead> 
             <tbody> 
              <tr> 
               <td>1</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>5.31s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>2</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>5.22s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>3</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>5.15s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>4</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>5.13s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>5</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>5.11s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>6</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>5.10s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>7</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>5.09s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>8</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>5.06s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>9</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>4.98s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>10</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>4.97s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>11</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>4.95s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>12</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>4.92s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>13</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>4.91s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>14</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>4.87s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>15</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>4.71s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>16</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>4.65s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>17</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>4.63s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>18</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>4.60s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>19</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>4.55s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>20</td> 
               <td class="text-left"><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank"> http://f12.baidu.com/it/u=2942591……</a></td> 
               <td>112.97.98.198</td> 
               <td>4.21s</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
             </tbody> 
            </table> 
            <button class="col-md-2 btn btn-default col-md-offset-5">查看更多</button> 
           </div> 
          </div> 
          <!--top10--> 
          <div class="section"> 
           <div class="section-title">
             加载元素用时TOP20IP 
           </div> 
           <div class="section-body"> 
            <table class="table table-bordered table-advance text-center"> 
             <thead> 
              <tr> 
               <th class="text-center">排名</th> 
               <th class="text-left">IP</th> 
               <th class="text-center">域名数</th> 
               <th class="text-center">用时</th> 
               <th class="text-left">速率</th> 
               <th class="text-center">元素总大小</th> 
               <th class="text-center">操作</th> 
              </tr> 
             </thead> 
             <tbody> 
              <tr> 
               <td>1</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>2</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>3</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>4</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>5</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>6</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>7</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>8</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>9</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>10</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left pa">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>11</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>12</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>13</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>14</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>15</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>16</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>17</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>18</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>19</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
              <tr> 
               <td>20</td> 
               <td class="text-left">211.112.10.19</td> 
               <td>12</td> 
               <td>987ms</td> 
               <td class="text-left pa">5.762Mbps</td> 
               <td>1.2M</td> 
               <td><a href="#">详情</a></td> 
              </tr> 
             </tbody> 
            </table> 
            <button class="col-md-2 btn btn-default col-md-offset-5">查看更多</button> 
           </div> 
          </div> 
         </div> 
         <div class="tab-pane" id="tab_15_2"> 
          <div class="contrastTitle row"> 
           <div class="col-md-12 keyIndexWrap"> 
            <div class="showActive active">
             90%页面展示延迟
            </div> 
            <div class="showActive ">
             网站达标率
            </div> 
           </div> 
          </div> 
          <div class="contrastChart"> 
           <h4 class="text-center">省内-90%页面展示时延</h4> 
           <div class="row"> 
            <div class="col-md-6"> 
             <div id="contrastMap" style="height: 400px;"></div> 
            </div> 
            <div class="col-md-6"> 
             <div id="contrastBar" style="height: 400px;"></div> 
            </div> 
           </div> 
          </div> 
          <div class="contrastTableWrap"> 
           <table class="table contrastTable text-center "> 
            <thead> 
             <tr> 
              <th colspan="2"></th> 
              <th></th> 
              <th colspan="3">90%页面展示延迟</th> 
              <th></th> 
              <th colspan="3">网站达标率</th> 
             </tr> 
             <tr> 
              <th>#</th> 
              <th>地市</th> 
              <th></th> 
              <th>闲时</th> 
              <th>忙时</th> 
              <th>汇总</th> 
              <th></th> 
              <th>闲时</th> 
              <th>忙时</th> 
              <th>汇总</th> 
             </tr> 
            </thead> 
            <tbody> 
             <tr> 
              <td>1</td> 
              <td>温州市</td> 
              <td></td> 
              <td><i class="iconfont icon-yuandianzhong colorBlue"></i>5.86ms <i class="pull-right"></i></td> 
              <td><i class="iconfont icon-yuandianzhong colorOrange"></i>3.21ms</td> 
              <td>7.07ms</td> 
              <td></td> 
              <td><i class="iconfont icon-yuandianzhong colorBlue"></i>100%<i class="pull-right"></i></td> 
              <td><i class="iconfont icon-yuandianzhong colorOrange"></i>100%</td> 
              <td>100%</td> 
             </tr> 
             <tr> 
              <td>2</td> 
              <td>丽水市</td> 
              <td></td> 
              <td><i class="iconfont icon-yuandianzhong colorBlue"></i>5.86ms <i class="pull-right"></i></td> 
              <td><i class="iconfont icon-yuandianzhong colorOrange"></i>3.21ms</td> 
              <td>7.07ms</td> 
              <td></td> 
              <td><i class="iconfont icon-yuandianzhong colorBlue"></i>100%<i class="pull-right"></i></td> 
              <td><i class="iconfont icon-yuandianzhong colorOrange"></i>100%</td> 
              <td>100%</td> 
             </tr> 
             <tr> 
              <td>3</td> 
              <td>金华市</td> 
              <td></td> 
              <td><i class="iconfont icon-yuandianzhong colorBlue"></i>5.86ms <i class="pull-right"></i></td> 
              <td><i class="iconfont icon-yuandianzhong colorOrange"></i>3.21ms</td> 
              <td>7.07ms</td> 
              <td></td> 
              <td><i class="iconfont icon-yuandianzhong colorBlue"></i>100%<i class="pull-right"></i></td> 
              <td><i class="iconfont icon-yuandianzhong colorOrange"></i>100%</td> 
              <td>100%</td> 
             </tr> 
             <tr> 
              <td>4</td> 
              <td>杭州市</td> 
              <td></td> 
              <td><i class="iconfont icon-yuandianzhong colorBlue"></i>5.86ms <i class="pull-right"></i></td> 
              <td><i class="iconfont icon-yuandianzhong colorOrange"></i>3.21ms</td> 
              <td>7.07ms</td> 
              <td></td> 
              <td><i class="iconfont icon-yuandianzhong colorBlue"></i>100%<i class="pull-right"></i></td> 
              <td><i class="iconfont icon-yuandianzhong colorOrange"></i>100%</td> 
              <td>100%</td> 
             </tr> 
             <tr> 
              <td>5</td> 
              <td>绍兴市</td> 
              <td></td> 
              <td><i class="iconfont icon-yuandianzhong colorBlue"></i>5.86ms <i class="pull-right"></i></td> 
              <td><i class="iconfont icon-yuandianzhong colorOrange"></i>3.21ms</td> 
              <td>7.07ms</td> 
              <td></td> 
              <td><i class="iconfont icon-yuandianzhong colorBlue"></i>100%<i class="pull-right"></i></td> 
              <td><i class="iconfont icon-yuandianzhong colorOrange"></i>100%</td> 
              <td>100%</td> 
             </tr> 
             <tr> 
              <td>6</td> 
              <td>舟山市</td> 
              <td></td> 
              <td><i class="iconfont icon-yuandianzhong colorBlue"></i>5.86ms <i class="pull-right"></i></td> 
              <td><i class="iconfont icon-yuandianzhong colorOrange"></i>3.21ms</td> 
              <td>7.07ms</td> 
              <td></td> 
              <td><i class="iconfont icon-yuandianzhong colorBlue"></i>100%<i class="pull-right"></i></td> 
              <td><i class="iconfont icon-yuandianzhong colorOrange"></i>100%</td> 
              <td>100%</td> 
             </tr> 
             <tr> 
              <td>7</td> 
              <td>嘉兴市</td> 
              <td></td> 
              <td><i class="iconfont icon-yuandianzhong colorBlue"></i>5.86ms <i class="pull-right"></i></td> 
              <td><i class="iconfont icon-yuandianzhong colorOrange"></i>3.21ms</td> 
              <td>7.07ms</td> 
              <td></td> 
              <td><i class="iconfont icon-yuandianzhong colorBlue"></i>100%<i class="pull-right"></i></td> 
              <td><i class="iconfont icon-yuandianzhong colorOrange"></i>100%</td> 
              <td>100%</td> 
             </tr> 
             <tr> 
              <td>8</td> 
              <td>湖州市</td> 
              <td></td> 
              <td><i class="iconfont icon-yuandianzhong colorBlue"></i>5.86ms <i class="pull-right"></i></td> 
              <td><i class="iconfont icon-yuandianzhong colorOrange"></i>3.21ms</td> 
              <td>7.07ms</td> 
              <td></td> 
              <td><i class="iconfont icon-yuandianzhong colorBlue"></i>100%<i class="pull-right"></i></td> 
              <td><i class="iconfont icon-yuandianzhong colorOrange"></i>100%</td> 
              <td>100%</td> 
             </tr> 
             <tr> 
              <td>9</td> 
              <td>宁波市</td> 
              <td></td> 
              <td><i class="iconfont icon-yuandianzhong colorBlue"></i>5.86ms <i class="pull-right"></i></td> 
              <td><i class="iconfont icon-yuandianzhong colorOrange"></i>3.21ms</td> 
              <td>7.07ms</td> 
              <td></td> 
              <td><i class="iconfont icon-yuandianzhong colorBlue"></i>100%<i class="pull-right"></i></td> 
              <td><i class="iconfont icon-yuandianzhong colorOrange"></i>100%</td> 
              <td>100%</td> 
             </tr> 
            </tbody> 
           </table> 
           <div class="text-right detailsExplain  "> 
            <i class="iconfont icon-yuandianzhong colorBlue"></i>闲时 
            <i class="iconfont icon-yuandianzhong colorOrange"></i>忙时 
           </div> 
          </div> 
         </div> 
         <div class="tab-pane" id="tab_15_3"> 
          <div class="contrastTitle row"> 
           <div class="col-md-10 keyIndexWrap"> 
            <div class="showActive  active">
             90%页面展示延迟
            </div> 
            <div class="showActive  ">
             网站达标率
            </div> 
           </div> 
           <div class="col-md-2"> 
            <select class=" form-control"> <option value="">全部地市</option> <option value="0">温州市</option> <option value="1">丽水市</option> <option value="2">金华市</option> <option value="3">杭州市</option> <option value="4">绍兴市</option> <option value="5">舟山市</option> <option value="6">嘉兴市</option> <option value="7">湖州市</option> <option value="8">宁波市</option> </select> 
           </div> 
          </div> 
          <div class="row"> 
           <div class="dataTableBox col-md-9"> 
            <table class="dataTable table"> 
             <tbody> 
              <tr> 
               <td colspan="2"></td> 
               <td></td> 
               <td> 
                <div class="text-left detailsExplain  "> 
                 <i class="iconfont icon-yuandianzhong colorBlue"></i>闲时 
                 <i class="iconfont icon-yuandianzhong colorOrange"></i>忙时 
                </div> </td> 
              </tr> 
              <tr> 
               <td>
                <div class="dataBottomBorder">
                 最大值
                </div></td> 
               <td>
                <div class="dataBottomBorder">
                 最小值
                </div></td> 
               <td>
                <div class="dataBottomBorder">
                 上下波动
                </div></td> 
               <td>
                <div class="dataBottomBorder">
                 平均值
                </div></td> 
              </tr> 
              <tr> 
               <td><i class="iconfont icon-yuandianzhong colorBlue"></i>&nbsp;<span> 3.06</span><span>s</span></td> 
               <td><i class="iconfont icon-yuandianzhong colorBlue"></i>&nbsp;<span> 2.21</span><span>s</span></td> 
               <td><i class="iconfont icon-yuandianzhong colorBlue"></i>&nbsp;<span> 0.85</span><span>s</span></td> 
               <td><i class="iconfont icon-yuandianzhong colorBlue"></i>&nbsp;<span> 0.29</span><span>s</span></td> 
              </tr> 
              <tr> 
               <td><i class="iconfont icon-yuandianzhong colorOrange"></i>&nbsp;<span> 3.42</span><span>s</span></td> 
               <td><i class="iconfont icon-yuandianzhong colorOrange"></i>&nbsp;<span> 3.03</span><span>s</span></td> 
               <td><i class="iconfont icon-yuandianzhong colorOrange"></i>&nbsp;<span> 4.12</span><span>s</span></td> 
               <td><i class="iconfont icon-yuandianzhong colorOrange"></i>&nbsp;<span> 3.89</span><span>s</span></td> 
              </tr> 
             </tbody> 
            </table> 
           </div> 
          </div> 
          <div class="lineCharts"> 
           <div id="dataBarCharts" style="height: 350px;display: block;clear: both;padding-right: 20px;"></div> 
           <div class="text-tip">
            提示：点击某一天可显示当天详情信息
           </div> 
           <div class="row margin-top-20"> 
            <div class="col-md-7"> 
             <div style="height: 300px;" id="dataLineCharts"></div> 
            </div> 
            <div class="col-md-4 " style=""> 
             <div class="dayDataMarTop"> 
              <ul> 
               <li>11月14日数据统计</li> 
               <li><span class="glyphicon glyphicon-triangle-right"></span><span>最大值</span><span>4.21s</span></li> 
               <li><span class="glyphicon glyphicon-triangle-right"></span><span>最小值</span><span>2.04s</span></li> 
               <li><span class="glyphicon glyphicon-triangle-right"></span><span>闲时平均值</span><span>3.44s</span></li> 
               <li><span class="glyphicon glyphicon-triangle-right"></span><span>忙时平均值</span><span>4.07s</span></li> 
               <li><span class="glyphicon glyphicon-triangle-right"></span><span>波动</span><span>2.40s</span></li> 
              </ul> 
             </div> 
            </div> 
           </div> 
          </div> 
         </div> 
         <div class="tab-pane" id="tab_15_4"> 
          <div class="totalTitleTop"> 
           <div class="totalWrap">
             总体质差元素：
            <span>21</span>个
           </div>  
           <button class="btn btn-default">导出 <i class="glyphicon glyphicon-download"></i></button> 
           <div class="pull-right"> 
            <ul class="groupUl"> 
             <li class="showActive">升序</li> 
             <li class="showActive active">降序</li> 
            </ul> 
            <ul class="otherFilesUl"> 
             <li class="showActive">全部</li> 
             <li class="showActive active">图片(21)</li> 
             <li class="showActive">视频(21)</li> 
             <li class="showActive">文本(21)</li> 
             <li class="showActive">音频(21)</li> 
             <li class="showActive">其他(21)</li> 
            </ul> 
           </div> 
          </div> 
          <div class="space-5"></div> 
          <div class="panel-group fault-panel-group" id="accordion"> 
           <div class="panel panel-default"> 
            <div class="panel-heading"> 
             <h4 class="panel-title chooseThis" data-toggle="collapse" data-parent="#accordion" href="#collapseOne"> 
              <div class="warning-positon"> 
               <div class="warning-title">
                网易 https://www.163.com
               </div> 
               <div class="warning-content"> 
                <span class="alertContent">质差跟踪诊断</span>  
                <span>手动诊断</span>  
                <span class="bad-quality-num">质差数：<span>7</span></span>  
                <i class="iconfont icon-minus-bold"></i> 
               </div> 
              </div> </h4> 
            </div> 
            <div id="collapseOne" class="panel-collapse collapse in"> 
             <div class="panel-body"> 
              <table class="table table-bordered table-advance table-vertical-middle"> 
               <thead> 
                <tr> 
                 <th>元素质差</th> 
                 <th>类型</th> 
                 <th>大小</th> 
                 <th>平均下载时间</th> 
                 <th>累计出现次数</th> 
                </tr> 
               </thead> 
               <tbody> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
                <tr class="cutting-line"> 
                 <td colspan="6">
                  <div></div></td> 
                </tr> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
                <tr class="cutting-line"> 
                 <td colspan="6">
                  <div></div></td> 
                </tr> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
               </tbody> 
              </table> 
             </div> 
            </div> 
           </div> 
           <div class="panel panel-default"> 
            <div class="panel-heading chooseUp"> 
             <h4 class="panel-title chooseThis" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo"> 
              <div class="warning-positon"> 
               <div class="warning-title">
                腾讯 https://www.qq.com
               </div> 
               <div class="warning-content"> 
                <span class="alertContent">质差跟踪诊断</span>  
                <span>手动诊断</span>  
                <span class="bad-quality-num">质差数：<span>7</span></span>  
                <i class="iconfont icon-jia"></i> 
               </div> 
              </div> </h4> 
            </div> 
            <div id="collapseTwo" class="panel-collapse collapse"> 
             <div class="panel-body"> 
              <table class="table table-bordered table-advance table-vertical-middle"> 
               <thead> 
                <tr> 
                 <th>元素质差</th> 
                 <th>类型</th> 
                 <th>大小</th> 
                 <th>平均下载时间</th> 
                 <th>累计出现次数</th> 
                </tr> 
               </thead> 
               <tbody> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
                <tr class="cutting-line"> 
                 <td colspan="6">
                  <div></div></td> 
                </tr> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
                <tr class="cutting-line"> 
                 <td colspan="6">
                  <div></div></td> 
                </tr> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
               </tbody> 
              </table> 
             </div> 
            </div> 
           </div> 
           <div class="panel panel-default"> 
            <div class="panel-heading chooseUp"> 
             <h4 class="panel-title chooseThis" data-toggle="collapse" data-parent="#accordion" href="#collapseThree"> 
              <div class="warning-positon"> 
               <div class="warning-title">
                新浪 https://www.sina.com
               </div> 
               <div class="warning-content"> 
                <span class="alertContent">质差跟踪诊断</span>  
                <span>手动诊断</span>  
                <span class="bad-quality-num">质差数：<span>7</span></span>  
                <i class="iconfont icon-jia"></i> 
               </div> 
              </div> </h4> 
            </div> 
            <div id="collapseThree" class="panel-collapse collapse"> 
             <div class="panel-body"> 
              <table class="table table-bordered table-advance table-vertical-middle"> 
               <thead> 
                <tr> 
                 <th>元素质差</th> 
                 <th>类型</th> 
                 <th>大小</th> 
                 <th>平均下载时间</th> 
                 <th>累计出现次数</th> 
                </tr> 
               </thead> 
               <tbody> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
                <tr class="cutting-line"> 
                 <td colspan="6">
                  <div></div></td> 
                </tr> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
                <tr class="cutting-line"> 
                 <td colspan="6">
                  <div></div></td> 
                </tr> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
                <tr> 
                 <td><a href="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" title="http://f12.baidu.com/it/u=294259145,2892581300&amp;fm=76" target="_blank">https://yt-tab.nbsp.127.net/luping/10230${ctx}/resources${ctx}/resources</a></td> 
                 <td>jpeg</td> 
                 <td>3.47KB</td> 
                 <td>6.9s</td> 
                 <td>3</td> 
                </tr> 
               </tbody> 
              </table> 
             </div> 
            </div> 
           </div> 
          </div> 
         </div> 
         <div class="tab-pane" id="tab_15_5"> 
          <form> 
           <div class="bs-filter-form form-inline"> 
            <div class="form-group  "> 
             <label for="startTime1">开始时间：</label> 
             <input type="text" class="form-control read-only-normal" placeholder="请选择开始时间" id="startTime1" name="startTime" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm',maxDate:'#F{$dp.$D(\'endTime1\');}',isShowClear:false,readOnly:true})" readonly="" /> 
            </div> 
            <div class="form-group  "> 
             <label for="endTime1">完成时间：</label> 
             <input type="text" class="form-control read-only-normal" placeholder="请选择结束时间" id="endTime1" name="endTime" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm',minDate:'#F{$dp.$D(\'startTime1\');}',isShowClear:false,readOnly:true})" readonly="" /> 
            </div> 
            <div class="form-group"> 
             <label>状态：</label> 
             <select class="form-control"> <option value="0">全部</option> <option value="0">未执行</option> <option value="0">正在执行</option> <option value="5">暂停</option> <option value="5">执行完成</option> <option value="5">等待执行</option> <option value="5">下达失败</option> </select> 
            </div> 
            <button onclick="javascript:pageSubmit(1);" type="button" class="btn btn-primary filter-btn"><i class="fa fa-search"></i> 查询 </button> 
           </div> 
          </form> 
          <table class="table table-bordered table-advance"> 
           <thead> 
            <tr> 
             <th>网站名称</th> 
             <th>测试次数</th> 
             <th>90%页面展示时延</th> 
             <th>网站达标率</th> 
             <th>操作</th> 
            </tr> 
           </thead> 
           <tbody> 
            <tr> 
             <td><a href="http://www.163.com" target="_blank">http://www.163.com</a></td> 
             <td>12</td> 
             <td>23.83ms</td> 
             <td>100%</td> 
             <td> <a href="#">查看</a> <span class="split-line">|</span> <a href="#">删除</a> </td> 
            </tr> 
            <tr> 
             <td><a href="http://www.163.com" target="_blank">http://www.qq.com</a></td> 
             <td>12</td> 
             <td>23.83ms</td> 
             <td>100%</td> 
             <td> <a href="#">查看</a> <span class="split-line">|</span> <a href="#">删除</a> </td> 
            </tr> 
            <tr> 
             <td><a href="http://www.163.com" target="_blank">http://www.sina.com</a></td> 
             <td>12</td> 
             <td>23.83ms</td> 
             <td>100%</td> 
             <td> <a href="#">查看</a> <span class="split-line">|</span> <a href="#">删除</a> </td> 
            </tr> 
            <tr> 
             <td><a href="http://www.163.com" target="_blank">http://www.chinaz.com</a></td> 
             <td>12</td> 
             <td>23.83ms</td> 
             <td>100%</td> 
             <td> <a href="#">查看</a> <span class="split-line">|</span> <a href="#">删除</a> </td> 
            </tr> 
            <tr> 
             <td><a href="http://www.163.com" target="_blank">http://www.huaban.com</a></td> 
             <td>12</td> 
             <td>23.83ms</td> 
             <td>100%</td> 
             <td> <a href="#">查看</a> <span class="split-line">|</span> <a href="#">删除</a> </td> 
            </tr> 
            <tr> 
             <td><a href="http://www.163.com" target="_blank">http://www.alipay.com</a></td> 
             <td>12</td> 
             <td>23.83ms</td> 
             <td>100%</td> 
             <td> <a href="#">查看</a> <span class="split-line">|</span> <a href="#">删除</a> </td> 
            </tr> 
            <tr> 
             <td><a href="http://www.163.com" target="_blank">http://www.denghuang.com</a></td> 
             <td>12</td> 
             <td>23.83ms</td> 
             <td>100%</td> 
             <td> <a href="#">查看</a> <span class="split-line">|</span> <a href="#">删除</a> </td> 
            </tr> 
            <tr> 
             <td><a href="http://www.163.com" target="_blank">http://www.xinhua.com</a></td> 
             <td>12</td> 
             <td>23.83ms</td> 
             <td>100%</td> 
             <td> <a href="#">查看</a> <span class="split-line">|</span> <a href="#">删除</a> </td> 
            </tr> 
            <tr> 
             <td><a href="http://www.163.com" target="_blank">http://www.niu.com</a></td> 
             <td>12</td> 
             <td>23.83ms</td> 
             <td>100%</td> 
             <td> <a href="#">查看</a> <span class="split-line">|</span> <a href="#">删除</a> </td> 
            </tr> 
            <tr> 
             <td><a href="http://www.163.com" target="_blank">http://www.baidu.com</a></td> 
             <td>12</td> 
             <td>23.83ms</td> 
             <td>100%</td> 
             <td> <a href="#">查看</a> <span class="split-line">|</span> <a href="#">删除</a> </td> 
            </tr> 
            <tr> 
             <td><a href="http://www.163.com" target="_blank">http://www.souhu.com</a></td> 
             <td>12</td> 
             <td>23.83ms</td> 
             <td>100%</td> 
             <td> <a href="#">查看</a> <span class="split-line">|</span> <a href="#">删除</a> </td> 
            </tr> 
            <tr> 
             <td><a href="http://www.163.com" target="_blank">http://www.youku.com</a></td> 
             <td>12</td> 
             <td>23.83ms</td> 
             <td>100%</td> 
             <td> <a href="#">查看</a> <span class="split-line">|</span> <a href="#">删除</a> </td> 
            </tr> 
            <tr> 
             <td><a href="http://www.163.com" target="_blank">http://www.tudou.com</a></td> 
             <td>12</td> 
             <td>23.83ms</td> 
             <td>100%</td> 
             <td> <a href="#">查看</a> <span class="split-line">|</span> <a href="#">删除</a> </td> 
            </tr> 
           </tbody> 
          </table> 
          <div class="row mt5 mb5"> 
           <div class="col-sm-5">
            每页
            <select name="pageSize" class="input-xsmall form-control inline-block ml5 mr5" onchange="pageSubmit(1);return false;"> <option value="10">10</option> <option value="10" selected="">15</option> <option value="20">20</option> <option value="50">50</option> </select>条，总共36条，显示1到10 
           </div> 
           <div class="col-sm-7"> 
            <ul class="pagination no-margin  pull-right"> 
             <li class="disabled"><span>&lt;&lt;</span></li> 
             <li class="active"><a href="#" onclick="pageSubmit(1);return false;">1</a></li> 
             <li class=""><a href="#" onclick="pageSubmit(2);return false;">2</a></li> 
             <li class=""><a href="#" onclick="pageSubmit(3);return false;">3</a></li> 
             <li class=""><a href="#" onclick="pageSubmit(4);return false;">4</a></li> 
             <li><a href="#" onclick="pageSubmit(2);return false;">&gt;&gt;</a></li> 
            </ul> 
           </div> 
          </div> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
   </div> 
  </div> 
  <div class="modal fade" id="keyIndex" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> 
   <div class="modal-dialog" role="document"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close pull-right" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
      <h4 class="modal-title text-left" id="myModalLabel">关键指标</h4> 
     </div> 
     <div class="modal-body"> 
      <div class="text-left dialogWrap"> 
       <div class="allSelect"> 
        <div class="checkbox"> 
         <label> <input class="allselectChenk" type="checkbox" /> 全选 </label> 
        </div> 
       </div> 
       <div class="selectThis"> 
        <div class="checkbox"> 
         <label><input type="checkbox" checked="" />90%页面展示时延</label> 
        </div> 
        <div class="checkbox"> 
         <label><input type="checkbox" checked="" />网站达标率</label> 
        </div> 
        <div class="checkbox"> 
         <label><input type="checkbox" class="pagePingTime" />首页PING时延(ms)</label> 
        </div> 
        <div class="checkbox"> 
         <label><input type="checkbox" />首页PING抖动（ms）</label> 
        </div> 
        <div class="checkbox"> 
         <label><input type="checkbox" />首页PING次数</label> 
        </div> 
        <div class="checkbox"> 
         <label><input type="checkbox" />首页PING成功次数</label> 
        </div> 
       </div> 
      </div> 
     </div> 
     <div class="modal-footer"> 
      <!--<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>--> 
      <button type="button" class="btn btn-primary" data-dismiss="modal" onclick="addNetWrap()">确认</button> 
     </div> 
    </div> 
   </div> 
  </div> 
  <!--<div class="page-footer">
    <div class="container-fluid">  2016 &copy; Design by Songt.
        <a href="javascript:;" title="宁波普天通信技术有限公司" target="_blank">宁波普天通信技术有限公司</a>
    </div>
</div>--> 
  <div class="scroll-to-top"> 
   <i class="icon-arrow-up"></i> 
  </div> 
  <!-- END INNER FOOTER --> 
  <!-- END FOOTER --> 
  <!--[if lt IE 9]>
<script src="${ctx}/resources/metronic/global/plugins/respond.min.js"></script>
<script src="${ctx}/resources/metronic/global/plugins/excanvas.min.js"></script>
<![endif]--> 
  <!-- BEGIN CORE PLUGINS --> 
  <!--<script src="${ctx}/resources/metronic/global/plugins/bootstrap/js/bootstrap.js" type="text/javascript"></script>--> 
  <script src="${ctx}/resources/assets/plugins/cBootstrap3/js/bootstrap.min.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/metronic/global/plugins/js.cookie.min.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/metronic/global/plugins/bootstrap-hover-dropdown/bootstrap-hover-dropdown.min.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/metronic/global/plugins/jquery-slimscroll/jquery.slimscroll.min.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/metronic/global/plugins/jquery.blockui.min.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/metronic/global/plugins/bootstrap-switch/js/bootstrap-switch.min.js" type="text/javascript"></script> 
  <!-- END CORE PLUGINS --> 
  <!-- BEGIN PAGE LEVEL PLUGINS --> 
  <script src="${ctx}/resources/metronic/global/plugins/jquery-ui/jquery-ui.min.js" type="text/javascript"></script> 
  <!--<script src="${ctx}/resources/metronic/global/plugins/bootstrap-select/js/bootstrap-select.min.js" type="text/javascript"></script>
<script src="${ctx}/resources/metronic/global/plugins/bootstrap-select/js/i18n/defaults-zh_CN.min.js" type="text/javascript"></script>--> 
  <script src="${ctx}/resources/metronic/global/plugins/jquery-validation/js/jquery.validate.min.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/metronic/global/plugins/jquery-validation/js/additional-methods.min.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/metronic/global/plugins/jquery-validation/js/localization/messages_zh.min.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/metronic/global/plugins/ladda/spin.min.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/metronic/global/plugins/ladda/ladda.min.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/metronic/global/plugins/jquery-multi-select/js/jquery.multi-select.js" type="text/javascript"></script> 
  <!--手动修改过源码--> 
  <script src="${ctx}/resources/metronic/global/plugins/select2/js/select2.full.min.js" type="text/javascript"></script> 
  <!--<script src="${ctx}/resources/metronic/global/plugins/select2/js/i18n/zh-CN.js" type="text/javascript"></script>--> 
  <script src="${ctx}/resources/metronic/global/plugins/bootstrap-table/bootstrap-table.min.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/metronic/global/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/metronic/global/plugins/bootstrap-editable/bootstrap-editable/js/bootstrap-editable.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/metronic/global/plugins/bootbox/bootbox.min.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/metronic/global/plugins/bootstrap-toastr/toastr.min.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/metronic/global/plugins/bootstrap-confirmation/bootstrap-confirmation.min.js" type="text/javascript"></script> 
  <!-- END PAGE LEVEL PLUGINS --> 
  <!-- BEGIN THEME GLOBAL SCRIPTS --> 
  <script src="${ctx}/resources/metronic/global/scripts/app.min.js" type="text/javascript"></script> 
  <!-- END THEME GLOBAL SCRIPTS --> 
  <!-- BEGIN THEME LAYOUT SCRIPTS --> 
  <!--layout-new.js 已经被修改过--> 
  <script src="${ctx}/resources/metronic/layouts/layout3/scripts/layout-new.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/metronic/layouts/layout3/scripts/demo.min.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/metronic/layouts/global/scripts/quick-sidebar.min.js" type="text/javascript"></script> 
  <!-- END THEME LAYOUT SCRIPTS --> 
  <!-- BEGIN PAGE LEVEL PLUGINS --> 
  <script src="${ctx}/resources/assets/js/nbptUtil.js?v=1" type="text/javascript"></script> 
  <link rel="stylesheet" href="${ctx}/resources/assets/plugins/nbptLoading/nbptLoading.css" /> 
  <script src="${ctx}/resources/assets/plugins/nbptLoading/nbptLoading.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/assets/plugins/jquery-noty/jquery.noty.packaged.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/assets/plugins/My97DatePicker/WdatePicker.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/assets/plugins/mustache/mustache.js" type="text/javascript"></script> 
  <!--<script src="${ctx}/resources/assets/plugins/jqueryForm/jquery.form.min.js" type="text/javascript"></script>--> 
  <!--<script src="${ctx}/resources/assets/plugins/quicksearch/jquery.quicksearch.js" type="text/javascript"></script>--> 
  <script src="${ctx}/resources/assets/plugins/bootstrap-multiselect/js/bootstrap-multiselect.js" type="text/javascript"></script> 
  <script src="${ctx}/resources/assets/plugins/zTreeV3/js/jquery.ztree.all.min.js" type="text/javascript"></script> 
  <!--<script src="${ctx}/resources/assets/plugins/infinite-scroll/jquery.infinitescroll.min.js" type="text/javascript"></script>--> 
  <!--<script src="${ctx}/resources/assets/plugins/infinite-scroll/behaviors/manual-trigger.js" type="text/javascript"></script>--> 
  <script type="text/javascript" src="${ctx}/resources/assets/plugins/Validform/js/Validform.js"></script> 
  <!-- END PAGE LEVEL PLUGINS --> 
  <!-- BEGIN ConfigData --> 
  <script src="${ctx}/resources/assets/js/colorConfig.js" type="text/javascript"></script> 
  <!-- END ConfigData --> 
  <!-- BEGIN ECHARTS --> 
  <script src="${ctx}/resources/assets/plugins/echarts3/echarts.min.js"></script> 
  <!-- END ECHARTS -->
  <script src="${ctx}/resources/assets/plugins/GoJS/go.js"></script>   
   <script src="${ctx}/resources/assets/plugins/sidebar/js/jquery-accordion-menu.js" type="text/javascript"></script>
  <script type="text/javascript">
   (function($) {
    $.expr[":"].Contains = function(a, i, m) {
     return (a.textContent || a.innerText || "").toUpperCase().indexOf(m[3].toUpperCase()) >= 0;
    };
    function filterList(header, list) {
     //@header 头部元素
     //@list 无需列表
     //创建一个搜素表单
     var form = $("<form>").attr({
      "class":"filterform",
      action:"#"
     }), input = $("<input>").attr({
      "class":"filterinput",
      type:"text"
     });
     $(form).append(input).appendTo(header);
     $(input).change(function() {
      var filter = $(this).val();
      if (filter) {
       $matches = $(list).find("a:Contains(" + filter + ")").parent();
       $("li", list).not($matches).slideUp();
       $matches.slideDown();
      } else {
       $(list).find("li").slideDown();
      }
      return false;
     }).keyup(function() {
      $(this).change();
     });
    }
    $(function() {
     filterList($("#form"), $("#demo-list"));
     window.addEventListener('scroll', function(){
      var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
      if(scrollTop>40){
       $(".fix-left-bg").css("top", '0');
      }else{
       $(".fix-left-bg").css("top", '41px');
      }
     })
    });
   })($);
   $("#jquery-accordion-menu").jqueryAccordionMenu();
   $(function(){
    //顶部导航切换
    $("#demo-list li").click(function(){

     //简单的逻辑  开发需自行调整
     if($(this).find('.submenu').length){
      return ;
     }else{
      $("#demo-list li.active").removeClass("active");
      $($(this).parents("#demo-list li")).each(function(){
       $(this).addClass("active")
      });
      $(this).addClass("active");
     }

    })
   })

  $(function(){

//CDN加速厂商   元素结构占比
        var cdnChart = echarts.init(document.getElementById('cdnChart'));
        var cdnOption = {
            title:{
                text:"元素结构占比",
                left:"center",
                textStyle:{
                    fontStyle:'normal',
                    fontWeight:'600',
                    fontSize:14
                }
            },
            tooltip: {
                trigger: 'item',
                formatter: '{b}: {c} ({d}%)'
            },
            legend: {
                orient: 'vertical',
                x: 'left',
                data:['网宿','蓝汛','百度云','帝联','ICP自营',"阿里云"]
            },
            series: [
                {
                    type:'pie',
                    radius: ['40%', '55%'],
                    label: {
                        formatter: '{b|{b}：}{c}  {d|{d}%}  ',
                        backgroundColor: '#eee',
                        borderColor: '#aaa',
                        borderWidth: 1,
                        borderRadius: 4,
                        rich: {
                            c: {
                                color: '#999',
                                lineHeight: 22,
                                align: 'center',
                                borderColor: '#ddd',
                            },
                            b: {
                                fontSize: 12,
                                lineHeight: 22,
                                padding: [0, 5]
                            },
                            d: {
                                color: '#eee',
                                backgroundColor: '#334455',
                                padding: [0, 5],
                                borderRadius: 2
                            }

                        },
                        backgroundColor:"#eee"
                    },
                    data:[
                        {value:335, name:'网宿'},
                        {value:310, name:'蓝汛'},
                        {value:234, name:'百度云'},
                        {value:135, name:'ICP自营'},
                        {value:1048, name:'帝联'},
                        {value:180, name:'阿里云'}
                    ]
                }
            ]
        };
        cdnChart.setOption(cdnOption);
        cdnChart.on('click', function(){
            st_showFullPage('cdnChart-dialog', './d-element-detail.html');
        });
//元素运营商    元素运营商占比
        var operatorChart = echarts.init(document.getElementById('operatorChart'));
        var operatorOpts = {
            title:{
                text:"元素运营商占比",
                left:"center",
                textStyle:{
                    fontStyle:'normal',
                    fontWeight:'600',
                    fontSize:14
                }
            },
            tooltip: {
                trigger: 'item',
                formatter: '{b}: {c} ({d}%)'
            },
            legend: {
                orient: 'vertical',
                x: 'left',
                data:['中国移动','中国联通','中国电信','其他']
            },
            series: [
                {
                    type:'pie',
                    radius: ['40%', '55%'],
                    label: {
                        normal: {
                            formatter: '{b|{b}：}{c}  {d|{d}%}  ',
                            backgroundColor: '#eee',
                            borderColor: '#aaa',
                            borderWidth: 1,
                            borderRadius: 4,
                            rich: {
                                c: {
                                    color: '#999',
                                    lineHeight: 22,
                                    align: 'center',
                                    borderColor: '#ddd',
                                },
                                b: {
                                    fontSize: 12,
                                    lineHeight: 22,
                                    padding: [0, 5]
                                },
                                d: {
                                    color: '#eee',
                                    backgroundColor: '#334455',
                                    padding: [0, 5],
                                    borderRadius: 2
                                }
                            }
                        },
                        backgroundColor:"#eee"
                    },
                    data:[
                        {value:335, name:'中国移动'},
                        {value:310, name:'中国联通'},
                        {value:234, name:'中国电信'},
                        {value:135, name:'其他'}
                    ]
                }
            ]
        };
        operatorChart.setOption(operatorOpts);
        operatorChart.on('click', function(){
            st_showFullPage('operatorChart-dialog', './d-element-detail.html');
        });
//资源调度   省内外资源占比
        var resource1Chart = echarts.init(document.getElementById('resource1Chart'));
        var resource1Opts = {
            title:{
                text:"资源本网外网占比",
                left:"center",
                textStyle:{
                    fontStyle:'normal',
                    fontWeight:'600',
                    fontSize:14
                }
            },
            tooltip: {
                trigger: 'item',
                formatter: '{b}: {c} ({d}%)'
            },
            legend: {
                orient: 'vertical',
                x: 'left',
                data:['外网','本网']
            },
            series: [
                {
                    type:'pie',
                    radius: ['40%', '55%'],
                    label: {
                        normal: {
                            formatter: '{b|{b}：}{c}  {d|{d}%}  ',
                            backgroundColor: '#eee',
                            borderColor: '#aaa',
                            borderWidth: 1,
                            borderRadius: 4,
                            rich: {
                                c: {
                                    color: '#999',
                                    lineHeight: 22,
                                    align: 'center',
                                    borderColor: '#ddd',
                                },
                                b: {
                                    fontSize: 12,
                                    lineHeight: 22,
                                    padding: [0, 5]
                                },
                                d: {
                                    color: '#eee',
                                    backgroundColor: '#334455',
                                    padding: [0, 5],
                                    borderRadius: 2
                                }
                            }
                        },
                        backgroundColor:"#eee"
                    },
                    data:[
                        {value:335, name:'本网'},
                        {value:110, name:'外网'}
                    ]
                }
            ]
        };
        resource1Chart.setOption(resource1Opts);
        resource1Chart.on('click', function(){
            st_showFullPage('resource1Chart-dialog', './d-element-detail.html');
        });
//资源调度    资源本网外网占比
        var resource2Chart = echarts.init(document.getElementById('resource2Chart'));
        var resource2Opts = {
            title:{
                text:"省内外资源占比",
                left:"center",
                textStyle:{
                    fontStyle:'normal',
                    fontWeight:'600',
                    fontSize:14
                }
            },
            tooltip: {
                trigger: 'item',
                formatter: '{b}: {c} ({d}%)'
            },
            legend: {
                orient: 'vertical',
                x: 'left',
                data:['省内资源','省外资源']
            },
            series: [
                {
                    type:'pie',
                    radius: ['40%', '55%'],
                    label: {
                        normal: {
                            formatter: '{b|{b}：}{c}  {d|{d}%}  ',
                            backgroundColor: '#eee',
                            borderColor: '#aaa',
                            borderWidth: 1,
                            borderRadius: 4,
                            rich: {
                                c: {
                                    color: '#999',
                                    lineHeight: 22,
                                    align: 'center',
                                    borderColor: '#ddd',
                                },
                                b: {
                                    fontSize: 12,
                                    lineHeight: 22,
                                    padding: [0, 5]
                                },
                                d: {
                                    color: '#eee',
                                    backgroundColor: '#334455',
                                    padding: [0, 5],
                                    borderRadius: 2
                                }
                            }
                        },
                        backgroundColor:"#eee"
                    },
                    data:[
                        {value:50, name:'省内资源'},
                        {value:310, name:'省外资源'}
                    ]
                }
            ]
        };
        resource2Chart.setOption(resource2Opts);
        resource2Chart.on('click', function(){
            st_showFullPage('resource2Chart-dialog', './d-element-detail.html');
        });
//网络出口    网络出口占比
        var netChart = echarts.init(document.getElementById('netChart'));
        var netOpts = {
            title:{
                text:"网络出口占比",
                left:"center",
                textStyle:{
                    fontStyle:'normal',
                    fontWeight:'600',
                    fontSize:14
                }
            },
            tooltip: {
                trigger: 'item',
                formatter: '{b}: {c} ({d}%)'
            },
            legend: {
                orient: 'vertical',
                x: 'left',
                data:['联通出口','电信出口','三方出口']
            },
            series: [
                {
                    type:'pie',
                    radius: ['40%', '55%'],
                    label: {
                        normal: {
                            formatter: '{b|{b}：}{c}  {d|{d}%}  ',
                            backgroundColor: '#eee',
                            borderColor: '#aaa',
                            borderWidth: 1,
                            borderRadius: 4,
                            rich: {
                                c: {
                                    color: '#999',
                                    lineHeight: 22,
                                    align: 'center'
                                },

                                b: {
                                    fontSize: 12,
                                    lineHeight: 22,
                                    padding: [0, 5]
                                },
                                d: {
                                    color: '#eee',
                                    backgroundColor: '#334455',
                                    padding: [0, 5],
                                    borderRadius: 2
                                }
                            }
                        },
                        backgroundColor:"#eee"
                    },
                    data:[
                        {value:335, name:'电信出口'},
                        {value:310, name:'联通出口'},
                        {value:234, name:'三方出口'}
                    ]
                }
            ]
        };
        netChart.setOption(netOpts);
        netChart.on('click', function(){
            st_showFullPage('resource2Chart-dialog', './d-element-detail.html');
        });

//对比分析    省地图
        $.get('${ctx}/resources/assets/plugins/echarts3/json/zhejiang.json', function(zhejiangJson) {
            //echarts.registerMap('省份汉语名称', 省份拼音+Json);
            echarts.registerMap('浙江', zhejiangJson);
        });
        var contrastMap = echarts.init(document.getElementById('contrastMap'));
        var  contrastOpts={
            dataRange: {
                min: 0.0,
                max: 5.0,
                text:['优','差'],
                realtime: false,
                calculable : true,
                color: ['CornflowerBlue','lightblue','DeepSkyBlue']
            },
            tooltip: {
                show: true
            },
            series : [ {
                itemStyle:{
                    normal:{label:{show:true}},
                    emphasis:{label:{show:true}}
                },
                name:"闲时",
                type : 'map',
                map : '浙江',
                data:[
                    {name: '丽水市', value: 2},
                    {name: '杭州市', value: 1},
                    {name: '宁波市', value: 3},
                    {name: '金华市', value: 4},
                    {name: '温州市', value: 4},
                    {name: '台州市', value: 4},
                    {name: '绍兴市', value: 3},
                    {name: '湖州市', value: 4},
                    {name: '衢州市', value: 5},
                    {name: '嘉兴市', value: 2},
                    {name: '舟山市', value: 2},
                ]
            } ]
        }
        contrastMap.setOption(contrastOpts);

//对比分析   bar
        var contrastBar = echarts.init(document.getElementById('contrastBar'));
        var contrastBarOpts = {
            tooltip: {
                show: true
            },
            calculable : true,
            yAxis : [
                {
                    type : 'category',
                    data : ["宁波市","丽水市","金华市","杭州市","绍兴市","舟山市","嘉兴市","湖州市","温州市"]
                }
            ],
            xAxis : [
                {
                    type : 'value'
                }
            ],
            series : [
                {
                    name:"闲时",
                    type:"bar",
                    data:[3,2,4,1,3,2,2,4,4],
                    itemStyle: {
                        normal:{
                            color: 'Darkorange '
                        }
                    }
                }
            ]
        };
        contrastBar.setOption(contrastBarOpts);

//闲忙分析   bar
        var dataBarCharts = echarts.init(document.getElementById('dataBarCharts'));
        var dataBarOpts = {
            title:{
                text:"90%页面展示延迟闲忙占比",
                left:"center"
            },
            tooltip: {
                trigger: 'axis',
                axisPointer : {
                    type : 'shadow'
                },
            },
            grid : {
                left:64,
                top : 40,
                bottom: 30,
                right:30
            },
            legend: {
                data:['闲时','忙时'],
                left:'right'
            },
            xAxis : [
                {
                    type : 'category',
                    data : ["11-14","11-15","11-16","11-17","11-18","11-19","11-20"]
                }
            ],
            yAxis : [
                {
                    type : 'value'
                }
            ],
            series : [
                {
                    name:"闲时",
                    type:"bar",
                    data:[3.06, 2.21, 2.46,2.11 , 3.01, 2.98,2.60],
                    itemStyle: {
                        normal:{
                            color: '#549bd3'
                        }
                    },
                    markLine : {
                        data : [
                            {type : 'average', name: '平均值'}
                        ]
                    }
                },
                {
                    name:"忙时",
                    type:"bar",
                    data:[3.34, 3.04, 2.98, 3.22, 3.68, 4.04,3.98],
                    itemStyle: {
                        normal:{
                            color: '#ffc032'
                        }
                    },
                    markLine : {
                        data : [
                            {type : 'average', name: '平均值'}
                        ]
                    }
                }
            ]
        };
        dataBarCharts.setOption(dataBarOpts);
//闲忙分析   line
        var dataLineCharts = echarts.init(document.getElementById('dataLineCharts'));
        var datalineOpts = {
            title: {
                text: '11月14日当天趋势',
                left:'center'
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'cross'
                }
            },
            xAxis:  {
                type: 'category',
                boundaryGap: false,
                data : ["00:00","01:00","02:00","03:00","04:00","05:00","06:00","07:00","08:00","09:00","10:00","11:00","12:00","13:00","14:00","15:00","16:00","17:00","18:00","19:00","20:00","21:00","22:00","23:00"]
            },
            yAxis: {
                type: 'value',
                axisLabel: {
                    formatter: '{value} '
                },
                axisPointer: {
                    // snap: true
                }
            },
            series: [
                {
                    name:'闲时',
                    type:'line',
                    smooth: true,
                    data:[2.33, 3.01, 2.90, 3.34, 2.09, 2.33,2.12,2.32, 2.09, 2.19, 2.54, 3.0, 2.41,2.32, 2.06, 3.40, 2.70, 2.19, 2.30,2.16,2.55, 2.00, 4.20],
                    itemStyle: {
                        normal:{
                            color: '#549bd3'
                        }
                    },
                    markLine : {
                        data : [
                            {type : 'average', name: '平均值'}
                        ]
                    }
                }
            ]
        };
        dataLineCharts.setOption(datalineOpts);

        $(".clickResize > ul > li a").on('shown.bs.tab',function(){
            var index=$(this).parent().index();
            if(index==1){
                contrastBar.resize();
                contrastMap.resize()
            }if(index==2){
                dataBarCharts.resize();
                dataLineCharts.resize();
            }
        })


        $(".chooseThis").click(function(){
            $(this).parent().parent().siblings().find('i').removeClass().addClass("iconfont icon-jia")
            if( $(this).parent().next().is(":visible")){
                $(this).find('i').removeClass().addClass("iconfont icon-jia")
            }else{
                $(this).find('i').removeClass().addClass("iconfont icon-minus-bold")
            }
        })



        $(".showActive").click(function(){
            if($(this).hasClass("active")){
                return true;
            }else{
                $(this).addClass("active").siblings().removeClass("active");
            }
        });

        $("#accordion .chooseThis .alertContent").click(function(e) {
            e.stopPropagation();
            st_showFullPage("jjj", './report.html');
//            alert($(this).html())
        })

        $(".allselectChenk").change(function(){
            if($(".allselectChenk").is(":checked")){
                $(".selectThis .checkbox label input").prop("checked",true);
            }else{
                $(".selectThis  .checkbox label  input").prop("checked",false);
            }
        })



    })
    function addNetWrap(){
        var innerHtml=$(".ins-block .ins-widget .text");
        var innerHtmlArr=[]
        for( var i =0;i<innerHtml.length;i++){
            innerHtmlArr.push(innerHtml[i].innerHTML)
        }
        function testItem(arr, item) {
            for (var i = 0; i < arr.length; i++) {
                if (arr[i] == item) {
                    return true;
                }
            }
            return false;
        };
        if($(".pagePingTime").is(":checked")){
            var reg = /([^>]+)$/;
            var text=$(".pagePingTime").parent().html();
            var html=text.match(reg)[1];
            if(testItem(innerHtmlArr,html)){

            }else{
                var html='<div class="ins-widget"> <div class="count">4<small>ms</small></div> <div class="text">首页PING时延(ms)</div> </div>'
                $(".ins-block").append(html)
            }

        }
        $("#keyIndex").modal('hide')
    }
</script> 
 </body>
</html>